{include file="common/header"/}
<style>
    .layui-iconpicker-body.layui-iconpicker-body-page .hide {
        display: none;
    }
</style>
<div class="lemo-container">
    <div class="lemo-main">
        <div class="admin-main layui-anim layui-anim-upbit">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>{:lang('add')}轮播图</legend>
            </fieldset>
            <form class="layui-form layui-form-pane" lay-filter="form">
                <div class="layui-form-item">
                    <label class="layui-form-label">标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" required placeholder="请输入标题"
                            autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">url链接</label>
                    <div class="layui-input-block">
                        <input type="text" name="url" required placeholder="请输入标题"
                            autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-upload">
                    <button type="button" class="layui-btn" id="test1">上传图片</button>
                    <div class="layui-upload-list">
                        <img style="max-width: 300px;max-height: 250px;" class="layui-upload-img" id="demo1">
                        <p id="demoText"></p>
                    </div>
                </div>

                <input type="hidden" name="id">

                <!-- 隐藏输入框 用来存放上传后图片路径 -->
                <input id="credential_hide" name="image" type="hidden" lay-verify="credentialOne" autocomplete="off"
                    class="layui-input">

                <div class="layui-form-item">
                    <div class="layui-input-inline">
                        <button type="button" class="layui-btn" lay-submit="" lay-filter="submit"
                            id="submit">立即提交</button>
                        <a data-href="{:url('index')}" class="layui-btn layui-btn-primary back">返回</a>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

{include file="common/footer"/}
<script>
    layui.use(['form', 'layer', 'upload'], function () {
        var form = layui.form,
            layer = layui.layer,
            upload = layui.upload,
            $ = layui.jquery;

        var info = {:json_encode($info)};
        var url = "{:url('add')}";
        var icon = '';
        if (info) {
            form.val('form', info);
            $('#demo1').attr('src', info.image);
            var url = "{:url('edit')}";
        }

        //返回页面
        $('body').on('click', '.back', function () {
            var url = $(this).attr('data-href');
            layer.closeAll();
            window.parent.location.href = url;
        });

        form.on('submit(submit)', function (data) {
            $.post(url, data.field, function (res) {
                if (res.code>0) {
                    layer.msg(res.msg, { time: 1000, icon: 1 }, function () {
                        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                        parent.layer.close(index); //再执行关闭
                        parent.location.reload();//刷新父页面，注意一定要在关闭当前iframe层之前执行刷新
                    });
                } else {
                    layer.msg(res.msg, { time: 1000, icon: 2 });
                }
            });
        })

        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            , url: '{:url("sys.uploads/uploads")}' //改成您自己的上传接口
            // , auto: false
            , data: { type: 'image', path: 'banner' }
            , size: 200
            // , bindAction: '#submit'
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            }
            , done: function (res) {
                //如果上传失败
                if (res.code = 0) {
                    return layer.msg('上传失败');
                }
                //上传成功
                $('#credential_hide').val(res.url);
                return layer.msg('上传成功', { icon: 1, time: 1000 });
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function () {
                    uploadInst.upload();
                });
            }
        });

    });
</script>